<template>
  <div>
    <el-button type="text" @click="goDetial">审核</el-button>
    <el-drawer
        title="审核"
        size="820px"
        :destroy-on-close="true"
        :visible.sync="drawer">
      <processForm ref="processForm"></processForm>
      <div class="label">
        <span class="title">审核意见</span>
        <div style="width: 650px">
          <el-input
              type="textarea"
              class="textarea"
              :rows="2"
              placeholder="请输入内容"
              v-model="views">
          </el-input>
        </div>

      </div>
      <div class="btnBox">
        <el-button type="danger" size="small" class="btn" @click="submit(2)">不通过</el-button>
        <el-button type="primary" size="small" @click="submit(1)">通过</el-button>
      </div>
    </el-drawer>
    <el-dialog
        title="不通过"
        :visible.sync="dialogVisible"
        :destroy-on-close="true"
        width="400px">
      <el-form ref="form" :model="form" label-width="80px">
        <el-form-item label="状态" required>
          <el-radio-group v-model="form.operate">
            <el-radio :label="2">退回发起人</el-radio>
            <el-radio :label="3">归档</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
          <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="submitOp()">确 定</el-button>
      </span>
    </el-dialog>

  </div>
</template>

<script>
import processForm from "@/views/processHandling/module/processForm";
export default {
  name: "checkBtn",
  components:{
    processForm
  },
  props:{
    params:{
      default: ()=>{}
    }
  },
  methods:{
    goDetial(){
      this.drawer = true
      this.$nextTick(()=>{
        this.$refs.processForm.setData(this.params)
      })
    },
    submitOp(){
      let params = {
        "id": this.params.id,
        "operate": this.form.operate,
        "views": this.views
      }
      this.$api.contentAudit(params).then(res=>{
        this.$message.success('操作成功')
        this.drawer = false
        this.$emit('after-op')
      })
    },
    submit(num){
      if(num ==1){
        let params = {
          "id": this.params.id,
          "operate": num,
          "views": this.views
        }
        this.$api.contentAudit(params).then(res=>{
          this.$message.success('操作成功')
          this.drawer = false
          this.$emit('after-op')
        })
      }else if(num ==2){
        this.dialogVisible = true
      }

    },
  },
  data(){
    return {
      drawer:false,
      views:'',
      dialogVisible:false,
      form:{
        operate:2
      }
    }
  },
}
</script>

<style scoped lang="less">
.btnBox{
  display: flex;
  flex-direction: row-reverse;
  margin-right: 30px;
  margin-bottom: 30px;
  .btn{
    margin-left: 20px;
  }
}
.label{
  display: flex;
  padding: 20px;
  .title{
    display: inline-block;
    padding: 0 22px;
    color: #1890FF;
    border-left: 3px solid #1890FF;
    height: 18px;
    line-height: 18px;
  }
  .textarea{
    width: 650px;
  }
}
</style>